<template>
    <h1>用户借款还款明细</h1>

    <table>
        <thead>
            <tr>
                <th>借款项目名称</th>
                <th>利息</th>
                <th>用户借款金额</th>
                <th>登录名称</th>
                <th>用户借款还款金额</th>
                <th></th>
            </tr>
        </thead>

        <tbody>
            <tr v-for="item in show" >
                <td>{{ item.BM_Name }}</td>
                <td>{{ item.BMI_Interest }}</td>
                <td>{{ item.UBM_Money }}</td>
                <td>{{ item.UL_Name }}</td>
                <td>{{ item.UBR_Money }}</td>
                <td></td>
            </tr>
        </tbody>

    </table>

</template>

<script setup lang="ts">
import { ref,onMounted } from 'vue';  
import axios from 'axios';
import { useRoute } from 'vue-router';

const show = ref([{
    BM_Id:'',
    BM_Name:'',
    BMI_Interest:'',
    UBM_Money:'',
    UL_Name:'',
    UBR_Money:'',
}])

const route = useRoute();

console.log(route.params.Id);

onMounted (()=>{
    axios({
        method:'get',
        url:'http://localhost:56707/api/Borrow/GetUserBorrowMoneyRepay',
        params:{
            BMId:route.params.Id
        },
    })
    .then(function(res){
        console.log(res.data);
        show.value = res.data; 
    })
    .catch(function(error){
        console.log(error);
    })
})

</script>
